import 'package:country_code_picker/country_code_picker.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:vape_xe/routes/app_pages.dart';
import 'package:vape_xe/services/services.dart';
import 'package:vape_xe/utils/utils.dart';
import 'package:vape_xe/values/values.dart';
import 'package:vape_xe/widgets/widgets.dart';

import 'logic.dart';

class ForgetView extends GetView<ForgetController> {
  const ForgetView({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: const Icon(Icons.arrow_back_ios_new_rounded),
          onPressed: () => {Navigator.of(context).pop('刷新')},
        ),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          30.hGap,
          Padding(
            padding: EdgeInsets.symmetric(horizontal: 20.w),
            child: TabBar(
              tabs: controller.tabTitles.map((e) => Tab(text: e)).toList(),
              controller: controller.tabController,
              indicatorColor: AppColors.primaryText,
              indicatorPadding: EdgeInsets.symmetric(vertical: 8.h),

              /// 下面不要横线
              dividerHeight: 0,

              /// labelStyle里面设置color还无效
              unselectedLabelStyle: const TextStyle(fontWeight: FontWeight.bold),
              labelStyle: const TextStyle(fontWeight: FontWeight.bold),
              labelColor: AppColors.primaryText,
              unselectedLabelColor: AppColors.secondaryText,
            ),
          ),
          16.hGap,
          InnerContainerWidget(
            child: Obx(
                  () => Row(
                children: [
                  if (controller.isPhone)
                    Row(
                      children: [
                        CountryCodePicker(
                          enabled: true,
                          initialSelection: '+${ConfigStore.to.countryCode}',
                          showCountryOnly: false,
                          showOnlyCountryWhenClosed: false,
                          alignLeft: false,
                          dialogBackgroundColor: Colors.black,
                          closeIcon: const Icon(Icons.close, color: Colors.white),
                          hideSearch: true,
                          padding: EdgeInsets.zero,
                          showFlag: false,
                          showFlagDialog: true,
                          textStyle: TextStyle(fontSize: 14.sp, color: Colors.white, fontWeight: FontWeight.bold),
                          onChanged: (country) {
                            controller.dialCode = country.dialCode ?? '';
                          },
                        ),
                        Container(
                          width: 1.w,
                          height: 12.h,
                          color: Colors.white10,
                        ),
                      ],
                    ),
                  16.vGap,
                  Expanded(
                    child: TextField(
                      keyboardType: controller.isPhone ? TextInputType.number : TextInputType.emailAddress,
                      controller: controller.accountController,
                      decoration: InputDecoration(
                        border: InputBorder.none,
                        hintText: controller.isPhone ? 'Phone number'.tr : 'Email'.tr,
                        hintStyle: TextStyle(color: Colors.white54, fontSize: 14.sp, fontWeight: FontWeight.bold),
                      ),
                      style: TextStyle(color: Colors.white, fontSize: 14.sp, fontWeight: FontWeight.bold),
                    ),
                  ),
                ],
              ),
            ),
          ),
          36.hGap,
          GestureDetector(
            onTap: () => Get.toNamed(Routes.FORGET_CODE),
            child: Container(
              height: 52.h,
              margin: EdgeInsets.symmetric(horizontal: 32.w),
              decoration: BoxDecoration(
                gradient: const LinearGradient(colors: [Color(0xff6EDEF7), Color(0xff3351EF)]),
                borderRadius: 100.radius,
              ),
              child: Center(
                child: Text(
                  'Send Verification Code'.tr,
                  style: const TextStyle(fontFamily: 'Montserrat', fontWeight: FontWeight.bold),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}
